<template>
	<view class="content  ">
		<view v-bind:style="{height: (s+n) +'px'}" class="position-fixed width-100"
			style="top: 0; overflow: hidden; z-index: 9999;">
			<!--background: `` :style="{ }"  -->
			<view class="backGround" :style="{background: `url(${imgaeUrl('/static/bg.png')})`,opacity: headerOpt }">
				<view v-bind:style="{height: s+'px' }" />
				<view v-bind:style="{height: n+'px' }" class="display-flex center align-items">
					<view v-bind:style="{height: h+'px' }" style=" padding: 0 15rpx;" class=" display-flex align-items">
						<!-- <image :src="imgaeUrl('/static/home/title.png')" style="width: 196rpx;height: 56rpx;" mode="">
						</image> -->
						<view class="display-flex align-items">
							<image :src="local.get('config').logo" style="width: 60rpx;height: 60rpx;"
								class="border-radius" mode=""></image>
							<image :src="local.get('config').backstage_side_logo" style="width: 120rpx;height: 50rpx;"
								class="margin-left-10" mode=""></image>
						</view>
						<view style="margin: 0 10rpx;" class="display-flex file-1 align-items">
							<view @click="navigateTo('/pages/Home/search/search')" class=" file-1">
								<uv-search bgColor="#FFFFFF" :showAction="false" disabled placeholder="请搜索商品标题"
									v-model="keyword"></uv-search>
							</view>
							<view v-bind:style="{width: w+'px' }" class="">

							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view v-bind:style="{height: (s+n) +'px'}" class="position-absolute width-100"
			style="top: 0; overflow: hidden; z-index: 9999;">
			<view class="backGround">
				<view v-bind:style="{height: s+'px' }" />
				<view v-bind:style="{height: n+'px' }" class="display-flex center align-items">
					<view v-bind:style="{height: h+'px' }" style=" padding: 0 15rpx;"
						class="width-100 display-flex align-items">
						<view class="display-flex align-items">
							<image :src="local.get('config').logo" style="width: 60rpx;height: 60rpx;"
								class="border-radius" mode=""></image>
							<image :src="local.get('config').backstage_side_logo" style="width: 120rpx;height: 50rpx;"
								class="margin-left-10" mode=""></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view style="width: 100%;height: 456rpx;border-radius: 0 0 30rpx 30rpx;" class="">
			<uv-swiper keyName="images" @click="swiperClick" height="456rpx" radius="12" :list="swiperlist"></uv-swiper>
		</view>
		<view class="padding-about-24">
			<!-- 搜索 -->
			<view @click="navigateTo('/pages/Home/search/search')" class="" style="margin-top: -30rpx;">
				<uv-search bgColor="#FFFFFF" :showAction="false" disabled placeholder="请搜索商品标题" v-model="keyword">
				</uv-search>
			</view>
			<view class="view margin-top-20" style="padding: 28rpx 32rpx;display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 20rpx 5rpx;">
				<view v-for="item,index in toolslist" :key="index" @click="navigateTo(item.link_url)"
					class="display-flex space-between align-items flex-direction-column">
					<image :src="item.image" style="width: 108rpx;height: 108rpx;" mode="">
					</image>
					<view class="font-size-24 color-333">
						{{item.name}}
					</view>
				</view>
			</view>
			<!-- 直播 -->
			<view v-if="roomlist.length != 0" class="room margin-top-20 position-relative">
				<image :src="imgaeUrl('/static/icon.png')" style="width: 221.3rpx;height: 221.3rpx;top: 0;right: 20%;"
					class="position-absolute" mode=""></image>
				<view style="padding: 24rpx 24rpx 40rpx;">
					<view class="display-flex space-between align-items">
						<view class="display-flex align-items">
							<image :src="imgaeUrl('/static/home/k.png')" style="width: 53.45rpx;height: 52.79rpx;"
								mode=""></image>
							<image :src="imgaeUrl('/static/home/room-title.png')" class="margin-left-10"
								style="width: 194rpx;height: 54rpx;" mode="">
							</image>
						</view>
						<view @click="navigateTo('/pages/Home/roomlist/roomlist')" class="display-flex align-items">
							<view class="font-size-24 margin-right-10 color-666">
								更多直播
							</view>
							<image :src="imgaeUrl('/static/home/right.png')" style="width: 24rpx;height: 24rpx;"
								mode=""></image>
						</view>
					</view>
					<view v-for="item,index in roomlist" :key="index"
						@click="navigateTo('/pages/Home/roomDetails/roomDetails?id=' + item.id)"
						class="view margin-top-30 position-relative">
						<view v-if="item.type == 1" class="center-size-20 label2 position-absolute"
							style="top: 0;color: #FE693E; right: 0;font-size: 22rpx;">
							{{item.start_time}}
						</view>
						<view class="display-flex" style="padding: 24rpx;">
							<view class="yuan position-relative border-radius display-flex center align-items">
								<image :src="item.images" class="border-radius" style="width: 108rpx;height: 108rpx;"
									mode=""></image>
								<view v-if="item.type == 1"
									class="room-title position-absolute transform-translate-left"
									style="left: 50%;background: #FFEEEA;bottom: -5rpx;color: #FF351B;">
									预约中
								</view>
								<view v-if="item.type == 2"
									class="room-title button color-FFF position-absolute transform-translate-left"
									style="left: 50%;bottom: -5rpx;">
									直播中
								</view>
							</view>
							<view class="file-1 margin-left-20">
								<view class="font-size-28 font-weight-500 ">
									{{item.title}}
								</view>
								<view class="display-flex margin-top-15 align-items">
									<view class="label center-size-20 color-FFF">
										最高返
									</view>
									<view style="color: #FE693E;" class="label1 center-size-20">
										{{item.rate}}%
									</view>
								</view>
								<view class="font-size-22 margin-top-10 color-666 webkit-line-clamp"
									style="-webkit-line-clamp: 1;">
									{{item.description}}
								</view>
								<view class="display-flex space-between margin-top-10 align-items">
									<view class="user display-flex center align-items">
										<!-- <uv-avatar-group :urls="" size="16"
											gap="0.4"></uv-avatar-group> -->
										<view style="width: 100rpx; overflow: hidden;border-radius: 24rpx;" class="">
											<a-avatar-slideshow :urls="item.user_headimg"> </a-avatar-slideshow>
										</view>
										<view class=" margin-left-10" style="font-size: 18rpx;color: #808080;">
											{{(item.num / 10000).toFixed(2)}}万+推广
										</view>
									</view>
									<view class="button color-FFF font-size-22" style="padding: 10rpx 20rpx; ">
										去推广
									</view>
								</view>
								<view class="" style="height: 10rpx;">

								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="videolist.length != 0" class="margin-top-40">
				<view class="display-flex space-between align-items">
					<view class="display-flex align-items">
						<image :src="imgaeUrl('/static/home/k.png')" style="width: 53.45rpx;height: 52.79rpx;" mode="">
						</image>
						<image :src="imgaeUrl('/static/home/kh.png')" class="margin-left-10"
							style="width: 194rpx;height: 54rpx;" mode="">
						</image>
					</view>
					<view @tap="navigateTo('/pages/Home/shortVideo/shortVideo')" class="display-flex align-items">
						<view class="font-size-24 margin-right-10 color-666">
							更多视频
						</view>
						<view class="margin-top-05">
							<uv-icon name="arrow-right" color="#999999" size="12"></uv-icon>
						</view>
					</view>
				</view>
				<view class="margin-top-20">
					<scroll-view scroll-x="true" @scrolltolower="scrolltolower" class="scroll-view_H">
						<view class="" style="display: inline-block;">
							<view class="display-flex">
								<view class="view position-relative margin-right-20" v-for="item,index in videolist"
									@click="onVideo()" :key="index" style="overflow: hidden;width: 308rpx;">
									<view :class="['', {'showvideo': local.get('userinfo').is_tk != 1}]"> </view>
									<channel-video object-fit="cover" style="width: 308rpx;height: 440rpx;"
										:feed-token="item.feed_token" :promoterShareLink="item.promoter_share_link" />
									<view class="">
										<view style="padding: 20rpx;">
											<view class=" font-size-26 webkit-line-clamp"
												style="-webkit-line-clamp: 1;">
												{{item.product_name}}
											</view>
											<view class="margin-top-10" style="color: #FF2E38;">
												<text class="font-size-24">￥</text>
												<text
													class="font-weight-bold font-size-30">{{item.product_mini_price}}</text>
											</view>
											<view class="display-flex margin-top-15 align-items">
												<view
													style="color: #FF2E38;height: 40rpx;font-size: 24rpx;">
													预估佣金￥{{item.price}}
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
			<!-- <view class="view margin-top-20 display-flex space-between" style="padding: 20rpx;">
				<image src="/static/logo.png" style="width: 320rpx;height: 348rpx;" mode="aspectFill"></image>
				<view class="display-flex flex-direction-column space-between">
					<image src="/static/logo.png" style="width: 326rpx;height: 164rpx;" mode="aspectFill"></image>
					<image src="/static/logo.png" style="width: 326rpx;height: 164rpx;" mode="aspectFill"></image>
				</view>
			</view> -->
			<view class="margin-top-40"  v-if="hotGoodslist.length != 0" >
				<view class="display-flex space-between align-items">
					<view class=" font-size-32 font-weight-500">
						精选商品
					</view>
					<view @click="navigateTo('/pages/Home/selectedlist/selectedlist')" class="display-flex align-items">
						<view class="font-size-24 margin-right-10 color-666">
							更多精选
						</view>
						<view class="margin-top-05">
							<uv-icon name="arrow-right" color="#999999" size="12"></uv-icon>
						</view>
					</view>
				</view>
				<view class="">
					<view v-for="item,index in hotGoodslist" :key="index"
						@click="navigateTo('/pages/Home/goodsDetails/goodsDetails?id=' + item.product_id)"
						class="view margin-top-30 position-relative" style="overflow: hidden;">
						<view v-if="item.subsidy_price>0 && item.stock > 0"
							class=" label3 position-absolute display-flex align-items" style="top: 0; left: 0;">
							<view class="button color-FFF font-size-22"
								style="padding: 8rpx 20rpx;border-radius: 16rpx 0rpx 16rpx 0rpx;">
								爆品补贴
							</view>
							<view class="font-size-22 margin-left-20" style="color: #FA3110;">
								距离结束剩余
							</view>
							<view class="margin-left-20">
								<uv-count-down :time="item.end_time" format="DD天HH:mm:ss"></uv-count-down>
							</view>
						</view>
						<view class="" style="padding: 24rpx;">
							<view :class="item.subsidy_price>0 && item.stock > 0 ?'margin-top-40':''"
								class="display-flex ">
								<image :src="item.thumb_img" style="width: 220rpx;height: 220rpx; border-radius: 20rpx;"
									mode=""></image>
								<view class="file-1 display-flex flex-direction-column space-between margin-left-20">
									<view class="font-size-28 webkit-line-clamp" style="-webkit-line-clamp: 2;">
										{{item.title}}
									</view>
									<view class="">
										<view class="display-flex align-items">
											<view class="margin-top-10" style="color: #FF2E38;">
												<text class="font-size-24 font-weight-bold">￥</text>
												<text class=" font-size-36 font-weight-bold">{{item.sale_price}}</text>
											</view>
											<view v-if="item.subsidy_price>0 && item.stock > 0"
												class="font-size-22 margin-top-10 margin-left-20"
												style="background: #F6F6F6;padding: 3rpx 12rpx; color: #FD6C56;">
												剩余{{item.stock}}单补贴
											</view>
										</view>
										<!-- 	<view v-if="item.subsidy_price>0 && item.stock > 0" class="btn margin-top-15">

										</view> -->
										<view v-if="item.subsidy_price>0 && item.stock > 0"
											class="buttons position-relative display-flex space-between margin-top-20">
											<view class=""></view>
											<image :src="imgaeUrl('/static/home/btn.png')"
												style="width: 214rpx;height: 72rpx;" mode=""></image>
											<view class="position-absolute display-flex space-between align-items"
												style="width: 100%;height: 100%;top: 0;">
												<view style="width: 114rpx;height: 72rpx;"
													class="display-flex flex-direction-column  align-items">
													<view class="">
														<view style="color: #FF2E38;">
															<text class="font-size-20 font-weight-500">￥</text>
															<text
																class=" font-size-28 font-weight-bold">{{item.price}}</text>
														</view>
													</view>
													<view class="font-size-20 "
														style="color: #FF2E38;margin-top: -6rpx;">
														{{ item.plan_type == 1?'定向高佣':'预估佣金'}}
													</view>
												</view>
												<view class="font-size-36 font-weight-bold" style="color: #FF2E38;">
													+
												</view>
												<view style="width: 184rpx;height: 72rpx;"
													class="color-FFF display-flex flex-direction-column  align-items">
													<view class="">
														<view>
															<text class="font-size-20 font-weight-500">￥</text>
															<text
																class=" font-size-28 font-weight-bold">{{item.subsidy_price}}</text>
														</view>
													</view>
													<view class="font-size-20 " style="margin-top: -6rpx;">
														每单补贴
													</view>
												</view>
											</view>
										</view>
										<view v-else class="display-flex margin-top-15 align-items">
											<view style="width: 108rpx;font-size: 22rpx;height: 40rpx;"
												class="label center-size-20  color-FFF">
												{{ item.plan_type == 1?'定向高佣':'预估佣金'}}
											</view>
											<view
												style="color: #FF2E38;width: 100rpx;font-size: 22rpx; height: 40rpx;border: none;background: #FFEEEA;"
												class="label1 center-size-20">
												¥{{item.price}}
											</view>
										</view>
									</view>
								</view>
							</view>
							<view v-if="item.reason" class="display-flex align-items margin-top-20">
								<image :src="imgaeUrl('/static/home/dian.png')" style="width: 28rpx;height: 26.79rpx;"
									mode="">
								</image>
								<view class="font-size-22 file-1 margin-left-20" style="color: #B45F3E;">
									<text class="font-weight-500">推荐理由：</text>
									<text>{{item.reason}}</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view style="padding-bottom: 20rpx;" class="display-flex align-items center margin-top-40">
				<image :src="imgaeUrl('/static/home/l.png')" style="width: 100rpx;height: 4rpx;" mode=""></image>
				<view class="font-size-32 font-weight-500" style="color: #FF7E00;margin: 0 20rpx;">
					热销好物
				</view>
				<image :src="imgaeUrl('/static/home/r.png')" style="width: 100rpx;height: 4rpx;" mode=""></image>
			</view>
		</view>
		<uv-sticky :offset-top="s+n">
			<view style="background: #FFFFFF;">
				<uv-tabs :list="tabslist" keyName="title" lineWidth="15" @click="tabsSwiper"
					lineColor="linear-gradient( 270deg, #FE6740 0%, #FE8B1D 100%)" :activeStyle="{
											color: '#262626',
											fontWeight: 'bold',
											transform: 'scale(1.05)',
											fontSize:'28rpx'
								    	}" :inactiveStyle="{
											color: '#7C7C7C',
											transform: 'scale(1)',
											fontSize:'28rpx'
										}" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"></uv-tabs>

				<view class="padding-about-24 padding-top-01">
					<view class="display-flex margin-top-10 space-between align-items">
						<view @tap="filterclick('new','')" :class="filter == 'new'?'tabs-active':'tabs'">
							最新发布
							<!--  最新发布 佣金率 佣金  价格 销量 -->
						</view>
						<view @tap="filterclick('sale_num','')" :class="filter == 'sale_num'?'tabs-active':'tabs'">
							七日销量
						</view>
						<view @tap="filterclick('rate','')" :class="filter == 'rate'?'tabs-active':'tabs'">
							<view class="">
								佣金率
							</view>
							<view class="margin-left-10">
								<uv-icon v-if="filter == 'rate' && sort == 'asc'" name="arrow-up-fill" color="red"
									size="6"></uv-icon>
								<uv-icon v-else name="arrow-up-fill" color="#7C7C7C" size="6"></uv-icon>
								<uv-icon v-if="filter == 'rate' && sort == 'desc'" name="arrow-down-fill" color="red"
									size="6"></uv-icon>
								<uv-icon v-else name="arrow-down-fill" color="#7C7C7C" size="6"></uv-icon>
							</view>
						</view>
						<view @tap="filterclick('price','')" :class="filter == 'price'?'tabs-active':'tabs'">
							<view class="">
								佣金
							</view>
							<view class="margin-left-10">
								<uv-icon v-if="filter == 'price' && sort == 'asc'" name="arrow-up-fill" color="red"
									size="6"></uv-icon>
								<uv-icon v-else name="arrow-up-fill" color="#7C7C7C" size="6"></uv-icon>
								<uv-icon v-if="filter == 'price' && sort == 'desc'" name="arrow-down-fill" color="red"
									size="6"></uv-icon>
								<uv-icon v-else name="arrow-down-fill" color="#7C7C7C" size="6"></uv-icon>
							</view>
						</view>
						<view @tap="filterclick('sale_price','')" :class="filter == 'sale_price'?'tabs-active':'tabs'">
							<view class="">
								价格
							</view>
							<view class="margin-left-10">
								<uv-icon v-if="filter == 'sale_price' && sort == 'asc'" name="arrow-up-fill"
									color="red" size="6"></uv-icon>
								<uv-icon v-else name="arrow-up-fill" color="#7C7C7C" size="6"></uv-icon>
								<uv-icon v-if="filter == 'sale_price' && sort == 'desc'" name="arrow-down-fill"
									color="red" size="6"></uv-icon>
								<uv-icon v-else name="arrow-down-fill" color="#7C7C7C" size="6"></uv-icon>
							</view>
						</view>
					</view>

				</view>
				<view style="height: 10rpx;"></view>
			</view>

		</uv-sticky>

		<view class="">
			<view class="item-view">


			</view>
			<view class="" style="padding: 0 15rpx; margin-top: -160rpx;">
				<!--  -->
				<liu-waterfall :dataList="goodslist" @click="wapperClick" :column="2"></liu-waterfall>
				<view v-if="islod" class="margin-top-20 display-flex center align-items">
					<image :src="imgaeUrl('/static/lod.gif')" style="width: 40rpx;height: 40rpx;" mode=""></image>
					<view class="font-size-26 margin-left-10 color-666">
						正在加载...
					</view>
				</view>
				<view v-else class="padding-about-24">
					<uv-divider text="数据加载完毕"></uv-divider>
				</view>
			</view>
			<div class="kong"></div>
			<div class="kong"></div>
			<div class="kong safe-area-inset-bottom"></div>
		</view>
		<a-customAuth ref="popup"></a-customAuth>
		<u-tabbar :current="0"></u-tabbar>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from 'vue';
	import {
		onLoad,
		onShow,
		onReady,
		onReachBottom,
		onPageScroll,
		onShareAppMessage,
		onShareTimeline
	} from '@dcloudio/uni-app';
	import {
		imgaeUrl,
		nativeUI,
		navigateTo,
		navigateBack,
		timestampToDate
	} from '@/utils/index.js';
	import * as api from '@/request/app.js'; // 引入api 方法
	import local from '@/utils/localStorage.js'; //引入本地存储方法
	const s = ref(getApp().globalData.s); //计算高度
	const n = ref(getApp().globalData.n); //计算胶囊
	const h = ref(getApp().globalData.h); //计算胶囊
	const w = ref(getApp().globalData.width)
	const tasactiveIndex = ref(0)
	const swiperlist = ref([]) //轮播图
	const roomlist = ref([]) //直播列表
	const videopagingState = ref(false)
	const videopage = ref(1)
	const videolist = ref([]) //热门视频

	const hotGoodslist = ref([]) //精选商品
	const page = ref(1)
	const goodslist = ref([]) //商品
	const waterfallsFlowRef = ref(null);
	const tabslist = ref([])
	const keyword = ref('')
	const filter = ref('new')
	const cid = ref(-1)
	const sort = ref('')
	const headerOpt = ref(0)
	const toolslist = ref([])
	const popup = ref(null)
	const islod = ref(true)
	onLoad(function(option) {
		console.log(option, 'lllllllllllllllllllll');
		if (option.puserId && !local.get('puserId')) {
			local.set('puserId', option.puserId)
		}
		if (local.get('token')) {
					getVideo()
				} else {
					getLogincode()
				}
		getAd()
		getLive()
		
		gethotGoodslist()
		getGoodsCategory()
		getGoodslist()
		tools()
	});
	onShow(function() {});
async function getLogincode() {
		const ret = await uni.login()
		console.log(ret.errMsg);
		if (ret.errMsg == 'login:ok') {
			login(ret.code)
		}
	}
	async function login(code) {
		const ret = await api.login({
			code,
			puserid: local.get('puserId') || 0
		})
		if (ret.code == 0) {
			local.set('token', ret.data.token)
			getuserinfo()
		}
	}
	async function getuserinfo() {
		const {
			code,
			data
		} = await api.getuserinfo()
		if (code == 0) {
			local.set('userinfo', data)
			getVideo()
		}
	}
	function onVideo(item) {
		let that = this
		if (local.get('userinfo').is_tk != 1) {
			popup.value.open()
			return;
		}
	}
	async function tools() {
		const {
			code,
			data
		} = await api.tools({
			type: 2
		})
		if (code == 0) {
			toolslist.value = data
		}
	}

	function wapperClick(item) {
		console.log('单项点击事件', item)
		navigateTo('/pages/Home/goodsDetails/goodsDetails?id=' + item.product_id)
	}

	function swiperClick(event) {
		navigateTo(swiperlist.value[event].link)
	}

	function filterclick(filters) {
		console.log(filters);
		if (filters == 'new' || filters == 'sale_num') {
			filter.value = filters
		} else {
			if (filter.value == filters) {
				filter.value = filters
				sort.value = sort.value == '' ? 'asc' : sort.value == 'desc' ? 'asc' : 'desc'
			} else {
				sort.value = 'asc'
				filter.value = filters
			}
		}
		page.value = 1
		goodslist.value = []
		getGoodslist()
	}
	/** 切换 */
	function tabsSwiper(event) {
		console.log(event);
		cid.value = event.id
		page.value = 1
		goodslist.value = []
		getGoodslist()
	}
	/** 获取热门视频*/
	async function getGoodslist() {
		let object = {
			page: page.value,
			title: keyword.value,
			is_hot: 0,
			filter: filter.value,
			cid: cid.value,
			sort: sort.value
		}
		const {
			code,
			data
		} = await api.getGoodslist(object)
		if (code == 0) {
			page.value = data.lastId
			goodslist.value = goodslist.value.concat(data.lists)
			islod.value = !islod.value
			// image: 'https://via.placeholder.com/40x60.png/EEE8AA',
			// title: '我是标题7',
			// desc: '描述描述描述描述'
		}
	}
	/** 商品分类*/
	async function getGoodsCategory() {
		const {
			code,
			data
		} = await api.getGoodsCategory()
		if (code == 0) {
			tabslist.value = [{
				id: -1,
				title: "全部"
			}, ...data]
		}
	}
	/** 精选商品*/
	async function gethotGoodslist() {
		let object = {
			is_hot: 1,
			filter:'sort',
			sort:'asc'
		}
		const {
			code,
			data
		} = await api.getGoodslist(object)
		if (code == 0) {
			hotGoodslist.value = data.lists
		}

	}
	/**视频分页 */
	function scrolltolower() {
		getVideo()
	}
	/** 获取热门视频*/
	async function getVideo() {
		let object = {
			page: videopage.value,
			limit: 4
		}
		if (!videopagingState.value) {
			const {
				code,
				data
			} = await api.getVideo(object)
			videolist.value = videolist.value.concat(data.data)
			if (!data.has_more) {
				videopagingState.value = true
				return
			}
			videopage.value++
		}
	}
	/** 获取直播 */
	async function getLive() {
		let object = {
			page: 1,
			limit: 4
		}
		const {
			code,
			data
		} = await api.getLive(object)
		if (code == 0) {
			roomlist.value = data.data
		}
	}
	/**
	 * 轮播图
	 */
	async function getAd() {
		let object = {
			cid: 1
		}
		const {
			code,
			data
		} = await api.getAd(object)
		if (code == 0) {
			swiperlist.value = data
		}
	}
	onReady(function() {});
	onReachBottom(function() {
		console.log(1);
		islod.value = !islod.value
		if(goodslist.value.length == 0) return
		getGoodslist()
	});
	onPageScroll(function(e) {
		headerOpt.value = Math.min(1, e.scrollTop / 200);
	});
	const pages = getCurrentPages(); // 获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面
	// 获取到当前页面的路径和参数
	const pag = pages[pages.length - 1].route; //完整路由地址
	console.log(local.get('config'), 'pagpagpagpagpagpag');
	onShareAppMessage(function(res) {
		console.log(pag + '?puserId=' + local.get('userinfo').id);
		return {
			title: local.get('config').subtitle,
			path: pag + '?puserId=' + local.get('userinfo').id,
		}
	})
	onShareTimeline(function(res) {
		return {
			title: local.get('config').subtitle,
			path: pag + '?puserId=' + local.get('userinfo').id,
		}
	})
</script>

<style scoped lang="scss">
	::v-deep .uv-avatar-group__item__show-more {
		display: none !important;
	}

	.item {
		padding: 20rpx;
	}

	.tabs,
	.tabs-active {
		padding: 8rpx 16rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 24rpx;
		border-radius: 8rpx;
	}

	.tabs-active {
		color: #FF351B;
		background: #FFEEEA;
	}

	.tabs {
		background: #F5F5F5;
		color: #7C7C7C;
	}

	.item-view {
		width: 750rpx;
		height: 192rpx;
		background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 68%, #F6F6F6 100%);
	}



	.scroll-view_H {
		white-space: nowrap;
		width: 100%;
	}

	.user {
		width: 238rpx;
		height: 44rpx;
		background: #F7F7F7;
		border-radius: 24rpx;
	}

	.label3 {
		// width: 432rpx;
		height: 48rpx;
		background: linear-gradient(90deg, #FEF1F0 0%, #FFFFFF 100%);
	}

	.label2 {
		// width: 160rpx;
		padding: 0 10rpx;
		height: 45rpx;
		background: #F6F6F6;
		border-radius: 0rpx 24rpx 0rpx 12rpx;
	}

	.label1 {
		width: 68rpx;
		height: 28rpx;
		background: #FFFFFF;
		border-radius: 0rpx 6rpx 6rpx 0rpx;
		border: 2rpx solid #FE683F;

	}

	.center-size-20 {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 20rpx;
	}

	.label {
		width: 80rpx;
		height: 32rpx;
		background: linear-gradient(270deg, #FE6740 0%, #FE8B1D 100%);
		border-radius: 6rpx 0 0 6rpx;
	}

	.room-title {
		width: 92rpx;
		height: 32rpx;
		border-radius: 16rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 20rpx;
	}

	.yuan {
		width: 124rpx;
		height: 124rpx;
		border: 2rpx solid #FE6B3C;
	}

	.room {
		width: 702rpx;
		// height: 560rpx;
		background: linear-gradient(180deg, #FFE5DE 0%, #FFE5DF 30%, #FFE5DF 100%);
		border-radius: 32rpx;
	}

	.showvideo {
		z-index: 99;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		// background: red;
	}

	.view {
		background: #FFFFFF;
		border-radius: 24rpx;
	}

	.backGround {
		width: 750rpx;
		height: 452rpx;
		background-size: 100% 100% !important;
		background-repeat: no-repeat;
		transition: all 0.5s;
	}
</style>